<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>{{title}}</title>
        <link rel="stylesheet" href="../static/index.css">
        <script src="../static/vue.js"></script>
        <link rel="stylesheet" href="../static/element_index.css">
        <script src="../static/index.js"></script>
        <script src="../static/axios.min.js"></script>
    </head>
    <style>
        .exit {
            position: absolute; top:0; left:20px; font-size:16px; cursor: pointer;
            display: inline-block;
            width: 50px;
            height: 50px;
            background:#66b1ff;
            text-align: center;
            line-height: 50px;
            color: white;
            border-radius: 50%;
        }
    </style>
    <div id="app">
        <p class="exit"  v-on:click="returns">返回</p>
    </div>
        {% block body %}




<form action="demo-form.php">
<p>
  <input type="submit" value="提交">
  <button type="button" class="btn btn-xs btn-primary">Primary</button></p>
</form>


        {% endblock %}


    </body>
    <script>
        var vm = new Vue({
            el: "#app",
            data() {
                return {
                    urls: "",
                    srcs: "data:image/jpg;base64,",
                    names: ""
                }
            },
            methods: {
                getPlantData() {
                    console.log(this.urls)
                    axios.get("http://chikei0916.pythonanywhere.com/plantdata", { params: { url: this.urls } }).then(rep => {
                        this.srcs = "data:image/jpg;base64," + rep.data.imgbase64
                        this.names = "植物名为:" + rep.data.name
                    })
                },
                returns() {
                    window.location.href = "http://chikei0916.pythonanywhere.com/";
                }
            }
        })
    </script>
</html>